<template>
	<div class="home" @click="jump(item.iid)">
		<van-image width="174" height="241" :src="item.img" />
		<span class="name">{{ item.props[0] }}</span>
		<div class="price">
			<span>￥{{ item.price }}</span>
			<span class="col"> {{ item.cfav }} <van-icon name="star-o" size="13" /> </span>
		</div>
		<div class="buy">立即购买</div>
	</div>
</template>

<script>
export default {
	name: "WorkspaceJsonLikeComponents",

	props: ["item"],

	data() {
		return {};
	},

	mounted() {},

	methods: {
		jump(id) {
			this.$router.push({name: "goods-detail", params: {id: id}});
		},
	},
};
</script>

<style lang="scss" scoped>
.home {
	background-color: #fff;
}
.name {
	display: block;
	width: 164px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 12.5px;
	color: #333333;
	padding: 5px;
}
.price {
	display: flex;
	justify-content: space-between;
	color: rgb(51, 51, 51);
	font-weight: 700;
	padding: 5px;
	.col {
		color: #666;
		font-size: 12px;
	}
}
.buy {
	color: rgb(255, 255, 255);
	background-color: rgb(255, 87, 119);
	width: 100%;
	height: 28px;
	line-height: 28px;
	border-radius: 4px;
	font-size: 13px;
	text-align: center;
	margin-top: 5px;
	margin-bottom: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
</style>
